<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<meta http-equiv="Cache-Control" content="no-siteapp">
		<link rel="stylesheet" href="../../../layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="../../../css/public.css" media="all" />
	</head>

	<body class="childrenBody">
		<form class="layui-form">
			<blockquote class="layui-elem-quote quoteBox">
				<form class="layui-form">
					<div class="layui-inline">
						<label class="layui-form-label">设备型号</label>
						<div class="layui-input-inline">
							<input type="text" class="layui-input searchVal" id="model" name="model" placeholder="">
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">状态</label>
						<div class="layui-input-inline">
							<!-- 状态 1-入库、2-出库中、3-出库、4-领用、5-报修 -->
							<select id="status" name="status" class="searchVal" lay-filter="status">
								<option value="">全部</option>
								<option value="1">入库</option>
								<option value="2">出库中</option>
								<option value="3">出库</option>
								<option value="4">领用</option>
								<option value="5">报修</option>
							</select>
						</div>
					</div>
				</form>
				<div class="layui-inline">
					<a class="layui-btn search-btn" data-type="reload">搜索</a>
				</div>
			</blockquote>
			<blockquote class="layui-elem-quote quoteBox">
				<div class="layui-inline">
					<a class="layui-btn layui-btn-normal insert-btn" has-permission="000500050000">添加</a>
					<a class="layui-btn layui-btn-danger layui-btn-normal delAl-btn" has-permission="000500050010">批量删除</a>
					<a class="layui-btn layui-btn-warm upload-btn">导入</a>
					<a id="export_device" class="layui-btn layui-btn-warm">导出</a>
					<a href="设备明细表.xls" class="layui-btn layui-btn-warm">下载模板</a>
					<a id="buy_btn" class="layui-btn layui-btn-warm" target="_blank" >买入商品</a>
					<a id="pr_btn" class="layui-btn layui-btn-warm" >购买记录</a>
				</div>
			</blockquote>
			<table id="list" lay-filter="list"></table>
			<div class="list-page" id="page"></div>
		</form>
		<script type="text/javascript" src="../../../js/jquery-2.1.1.min.js"></script>
		<script type="text/javascript" src="../../../layui/layui.js"></script>
		<script type="text/javascript" src="../../../custom/js/common.js"></script>
		<script type="text/javascript">
			layui.use(['form', 'layer', 'table', 'laypage', 'laytpl'], function() {
				var listApi = constant.baseUrl + '/device/device/list';
				var toInsertHtml = 'insert.html';
				var toUpdateHtml = 'insert.html';
				var toUploadHtml = 'upload.html';
				var toBuyHtml = 'buy.html';
				var toPurchaseRecordsHtml = 'purchaserecords.html'
				var deleteApi = constant.baseUrl + '/device/device/delete';
				var exportApi = constant.baseUrl + '/device/device/export?jwttoken='+cache.token.get();
				var cols = [
					[{
						//type : "checkbox",
						fixed: "left",
						width: 50,
						title: '<input type="checkbox" lay-skin="primary"  id="check-all" class="check-all" lay-filter="check-all">',
						templet: function(d) {
							var str = '';
							str += '<input type="checkbox" lay-skin="primary" class="check-one"  value="' + d.id +
								'" lay-filter="check-one">';
							return str;
						}
					}, {
						field: 'dtname',
						title: '设备类型',
						align: 'center'
					}, {
						field: 'dtbrand',
						title: '品牌',
						align: 'center'
					}, {
						field: 'dtmodel',
						title: '设备型号',
						align: 'center'
					}, {
						field: 'code',
						title: '设备流水号',
						align: 'center',
					}, {
						field: 'residual',
						title: '净值',
						align: 'center',
					}, {
						field: 'price',
						title: '购买价钱',
						align: 'center',
					}, {
						field: 'status',
						title: '状态',
						align: 'center',
						templet: function(d) {
							//状态 1-入库、2-出库中、3-出库、4-领用、5-报修
							if (d.status == 1) {
								return '入库'
							} else if (d.status == 2) {
								return '出库中'
							} else if (d.status == 3) {
								return '出库'
							} else if (d.status == 4) {
								return '领用'
							} else {
								return '报修'
							}
						}
					}, {
						field: 'ucreator',
						title: '登记人',
						align: 'center',
					}, {
						field: 'ubuyer',
						title: '购买人',
						align: 'center',
					}, {
						field: 'sno',
						title: '序列号',
						align: 'center',
					}, {
						title: '操作',
						fixed: "right",
						align: "center",
						width: 300,
						templet: function(d) {
							var str = '';
							if (hasPermission('000500050005')) {
							str += '<a class="layui-btn layui-btn-xs" lay-event="toUpdate">编辑</a>';
							}
							if (hasPermission('000500050010')) {
							str += '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">删除</a>';
							}
							return str;
						}
					}]
				];
				var pram = merger(constant.page.toUri(), getsearchVal());
				var form = layui.form,
					layer = parent.layer === undefined ? layui.layer : top.layer;
				var $ = layui.jquery;
				var laytpl = layui.laytpl;
				var table = layui.table;
				var laypage = layui.laypage;
				tableIns = table.render({
					elem: '#list',
					cellMinWidth: constant.table.cellMinWidth,
					page: false,
					height: constant.table.height,
					cols: cols,
					done: function(res, page, count) {
						checkAll(form);
					}
				});
				//用户列表
				listLoad(pram);

				function listLoad(data) {
					//loadAjax
					//第一个参数url
					//第二个参数 请求参数
					//第三个参数 请求表单
					//success回调
					loadAjax(listApi, "get", data, function(response) {
						//baseCallBack
						//第一个参数response 
						//第二个参数响应码为1000的时候回调函数
						baseCallBack(response, function(response) {
							table.reload("list", {
								data: response.data.records,
								limit: response.data.size
							})
							var page = laypage.render({
								elem: 'page',
								limits: constant.page.limits,
								limit: response.data.size,
								layout: constant.page.layout,
								curr: response.data.current,
								count: response.data.total,
								jump: function(obj, first) {
									if (!first) {
										pram = merger(constant.page.toUri(obj), getsearchVal());
										listLoad(pram);
									}
								}
							});
						});
					});
				}

				//搜索【此功能需要后台配合，所以暂时没有动态效果演示】
				$(".search-btn").click(function() {
					pram = merger(pram, getsearchVal());
					listLoad(pram);
				});

				//添加
				$(".insert-btn").click(function() {
					openFullLayer("添加", toInsertHtml);
				});

				//上传
				$(".upload-btn").click(function() {
					openAreaLayer("上传", toUploadHtml, "400px", "350px", true);
				});

				
				//导出
				$("#export_device").click(function() {
					location.href=exportApi;
				});
				
				//购买
				$("#buy_btn").click(function() {
					openFullLayer("购买", toBuyHtml);
				});
				
				//记录
				$("#pr_btn").click(function() {
					openAreaLayer("购买记录", toPurchaseRecordsHtml, "1000px", "500px", true);
				});

				//批量删除
				$(".delAl-btn").click(function() {
					var ids = getCheckedId();
					if (ids && ids.length) {
						confirmLayer('提示信息', '确定删除？', function(confirm, index) {
							loadAjax(deleteApi + "/" + ids, "delete", null, function(response) {
								baseCallBack(response, function(response) {
									layer.msg(response.msg);
									listLoad(pram);
									confirm.close(index);
								});
							});
						})
					} else {
						layer.msg("请选择需要删除的数据");
					}
				});

				//列表操作
				table.on('tool(list)', function(obj) {
					var layEvent = obj.event;
					var data = obj.data;
					if (layEvent === 'toUpdate') {
						//编辑
						openFullLayer("编辑", toUpdateHtml + "?id=" + data.id);
					}

					if (layEvent === 'delete') {
						//删除
						confirmLayer('提示信息', '确定删除？', function(confirm, index) {
							loadAjax(deleteApi + "/" + data.id, "delete", null, function(response) {
								baseCallBack(response, function(response) {
									layer.msg(response.msg);
									listLoad(pram);
									confirm.close(index);
								});
							});
						})
					}
				});
			})
		</script>
	</body>

</html>
